<template>
  <div class="customSetupBox">
      <div class="customContant">
        <div class="public-header">
          <div class="public-header-ch">创建子管理员</div>
          <div class="public-header-line"></div>
        </div>
        <div class="createAccount">
          <div class="accountTitle">创建企业管理员账号</div>
          <div class="account">
              <div>
                <label>登录邮箱EMAIL</label>
                <input type="text" placeholder="请输入邮箱">
              </div>
              <div>
                <label>密码PASSWORD</label>
                <input type="text" placeholder="请输入邮箱">
              </div>
              <div>
                <label>公司COMPANY</label>
                <input type="text" placeholder="请输入邮箱">
              </div>
              <div>
                <label>联系方式CONTACT INFO</label>
                <input type="text" placeholder="请输入邮箱">
              </div>
              <div>
                <label>行业INDUSTRY INFO</label>
                <input type="text" placeholder="请输入邮箱">
              </div>
              <div>
                <label>联系人LINKMAN</label>
                <input type="text" placeholder="请输入邮箱">
              </div>
          </div>
        </div>
        <div class="public-header">
          <div class="public-header-ch">已购课程</div>
          <div class="public-header-line"></div>
        </div>
        <div class="boughtCourse">
          <div>
            <el-checkbox>MarkSimos</el-checkbox>
            <el-input v-model="markSimos"></el-input>
            <el-button type="text" @click="dialogVisible = true">
              <span class="addEdit">
                <img class="addImg" src="../../static/image/god-bianji.png" alt="">
                编辑人数
              </span>
            </el-button>
            <el-dialog
              :visible.sync="dialogVisible">
              <div class="addTitle">
                <div @click="addShow='新增可上课人数'">
                  <p class="addTitle" :class="{'activeTitle':addShow=='新增可上课人数'}">新增可上课人数</p>
                  <p class="addLine" :class="{'activeLine':addShow=='新增可上课人数'}"></p>
                </div>
                <div :class="{'addActive':addShow=='扣除可上课人数'}" @click="addShow='扣除可上课人数'">
                  <p class="addTitle" :class="{'activeTitle':addShow=='扣除可上课人数'}">扣除可上课人数</p>
                  <p class="addLine" :class="{'activeLine':addShow=='扣除可上课人数'}"></p>
                </div>
              </div>
              <!-- 新增可上课人数 start -->
              <div class="addNumber" v-if="addShow == '新增可上课人数'">
                  <div class="addNumberTitle">MarkSimos</div>
                  <div class="addNumberInput">
                    <el-input></el-input>
                  </div>
                  <div class="addNumberSigle">已有可上课人数0人</div>
                  <div class="addNumberTatol">合计：100人</div>
              </div>
              <!-- 新增可上课人数 ending-->
              <!-- 扣除可上课人数 start -->
              <div class="addNumber" v-if="addShow == '扣除可上课人数'">
                <div class="addNumberTitle">MarkSimos</div>
                  <div class="addNumberInput">
                    <el-input></el-input>
                  </div>
                  <div class="addNumberSigle">已有可上课人数0人</div>
                  <div class="addNumberTatol">合计：50人</div>
              </div>
              <!-- 扣除可上课人数 ending-->
              <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible = false" class="fault">取 消</el-button>
                <el-button type="primary" @click="dialogVisible = false" class="fault">确 认</el-button>
              </span>
            </el-dialog>
          </div>
          <div>
            <el-checkbox>ChangeMan</el-checkbox>
            <el-input v-model="changeMan"></el-input>
            <el-button type="text" @click="dialogVisibleOne = true">
              <span class="addEdit">
                <img class="addImg" src="../../static/image/god-bianji.png" alt="">
                编辑人数
              </span>
            </el-button>
            <el-dialog
              :visible.sync="dialogVisibleOne">
              <div class="addTitle">
                <div @click="addShow='新增可上课人数'">
                  <p class="addTitle" :class="{'activeTitle':addShow=='新增可上课人数'}">新增可上课人数</p>
                  <p class="addLine" :class="{'activeLine':addShow=='新增可上课人数'}"></p>
                </div>
                <div :class="{'addActive':addShow=='扣除可上课人数'}" @click="addShow='扣除可上课人数'">
                  <p class="addTitle" :class="{'activeTitle':addShow=='扣除可上课人数'}">扣除可上课人数</p>
                  <p class="addLine" :class="{'activeLine':addShow=='扣除可上课人数'}"></p>
                </div>
              </div>
              <!-- 新增可上课人数 start -->
              <div class="addNumber" v-if="addShow == '新增可上课人数'">
                  <div class="addNumberTitle">MarkSimos</div>
                  <div class="addNumberInput">
                    <el-input></el-input>
                  </div>
                  <div class="addNumberSigle">已有可上课人数0人</div>
                  <div class="addNumberTatol">合计：100人</div>
              </div>
              <!-- 新增可上课人数 ending-->
              <!-- 扣除可上课人数 start -->
              <div class="addNumber" v-if="addShow == '扣除可上课人数'">
                <div class="addNumberTitle">MarkSimos</div>
                  <div class="addNumberInput">
                    <el-input></el-input>
                  </div>
                  <div class="addNumberSigle">已有可上课人数0人</div>
                  <div class="addNumberTatol">合计：50人</div>
              </div>
              <!-- 扣除可上课人数 ending-->
              <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible = false" class="fault">取 消</el-button>
                <el-button type="primary" @click="dialogVisible = false" class="fault">确 认</el-button>
              </span>
            </el-dialog>
          </div>
          <div>
            <el-checkbox>TeamSynergy</el-checkbox>
            <el-input v-model="teamSynergy"></el-input>
            <el-button type="text" @click="dialogVisibleTwo = true">
              <span class="addEdit">
                <img class="addImg" src="../../static/image/god-bianji.png" alt="">
                编辑人数
              </span>
            </el-button>
            <el-dialog
              :visible.sync="dialogVisibleTwo">
              <div class="addTitle">
                <div @click="addShow='新增可上课人数'">
                  <p class="addTitle" :class="{'activeTitle':addShow=='新增可上课人数'}">新增可上课人数</p>
                  <p class="addLine" :class="{'activeLine':addShow=='新增可上课人数'}"></p>
                </div>
                <div :class="{'addActive':addShow=='扣除可上课人数'}" @click="addShow='扣除可上课人数'">
                  <p class="addTitle" :class="{'activeTitle':addShow=='扣除可上课人数'}">扣除可上课人数</p>
                  <p class="addLine" :class="{'activeLine':addShow=='扣除可上课人数'}"></p>
                </div>
              </div>
              <!-- 新增可上课人数 start -->
              <div class="addNumber" v-if="addShow == '新增可上课人数'">
                  <div class="addNumberTitle">MarkSimos</div>
                  <div class="addNumberInput">
                    <el-input></el-input>
                  </div>
                  <div class="addNumberSigle">已有可上课人数0人</div>
                  <div class="addNumberTatol">合计：100人</div>
              </div>
              <!-- 新增可上课人数 ending-->
              <!-- 扣除可上课人数 start -->
              <div class="addNumber" v-if="addShow == '扣除可上课人数'">
                <div class="addNumberTitle">MarkSimos</div>
                  <div class="addNumberInput">
                    <el-input></el-input>
                  </div>
                  <div class="addNumberSigle">已有可上课人数0人</div>
                  <div class="addNumberTatol">合计：50人</div>
              </div>
              <!-- 扣除可上课人数 ending-->
              <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible = false" class="fault">取 消</el-button>
                <el-button type="primary" @click="dialogVisible = false" class="fault">确 认</el-button>
              </span>
            </el-dialog>
          </div>
        </div>
        <div class="public-header">
          <div class="public-header-ch">功能权限</div>
          <div class="public-header-line"></div>
        </div>
        <div class="functionalAuthority">
          <el-checkbox >创建挑战</el-checkbox>
          <el-checkbox >线上指导</el-checkbox>
          <el-checkbox >学员测试</el-checkbox>
          <el-checkbox >日程日历</el-checkbox>
          <el-checkbox >单机训练</el-checkbox>
          <el-checkbox >创建课程</el-checkbox>
          <el-checkbox >复盘工具</el-checkbox>
          <el-checkbox >数据报表导出</el-checkbox>
        </div>
        <div class="createButton">创建</div>
      </div>
  </div>
</template>
<script>
    export default {
        data(){
            return{
                addShow:'新增可上课人数',
                dialogVisible: false,
                dialogVisibleOne: false,
                dialogVisibleTwo: false,
                markSimos:'',
                changeMan:'',
                teamSynergy:'',
            }

        },
        computed:{
      
        },
        methods:{
        
        },
        created(){

        },
        mounted(){
        
        },
    }
</script>
